<template>
  <div>
    <MyHeadNav>我的账单</MyHeadNav>
    <ul class="box">
      <li>充值<i class="iconfont icon-jiantou"></i></li>
      <li>充值记录<i class="iconfont icon-jiantou"></i></li>
      <li>购买记录<i class="iconfont icon-jiantou"></i></li>
      <li>VIP<i class="iconfont icon-jiantou"></i></li>
    </ul>
  </div>
</template>

<script>
import MyHeadNav from "../../components/MyNavHead";
export default {
  name: "MyBill",
  components: {
    MyHeadNav,
  },
};
</script>

<style scoped lang="less">
.box {
  width: 100%;
  padding: 0.2rem;
  box-sizing: border-box;
  border: #fff;
  margin-top: 1.2rem;
  li {
    position: relative;
    letter-spacing: 1px;
    text-align: left;
    font-size: 16px;
    color: rgba(0, 0, 0, 0.8);
    width: 100%;
    padding-left: 0.2rem;
    box-sizing: border-box;
    border-bottom: 1px solid #ccc;
    height: 1rem;
    line-height: 1rem;
    border-radius: 3px;
    background: #fff;
    i {
      position: absolute;
      right: 0.3rem;
      font-weight: 600;
      color: rgba(0, 0, 0, 0.3);
    }
  }
}
</style>